<script setup>
	import { ref } from "vue"
	import { onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app"
	import { getClassifyAPI } from "@/api/index.js"

	// 分类列表
	const classifyList = ref([])
	const getClassifyList = async () => {
		const { data } = await getClassifyAPI({ pageSize: 15 })
		classifyList.value = data
	}
	getClassifyList()

	// 分享好友
	onShareAppMessage((e) => {
		return { title: "拾光壁纸-精选分类", path: "/pages/classify/classify" }
	})
	// 分享朋友圈
	onShareTimeline(() => {
		return { title: "拾光壁纸" }
	})
</script>

<template>
	<view class="page-bg">
		<!-- 自定义头部 -->
		<custom-nav-bar title="分类"></custom-nav-bar>
		<view class="classify-container">
			<theme-item v-for="item in classifyList" :key="item._id" :item="item"></theme-item>
		</view>
	</view>
</template>

<style lang="scss" scoped>
	.classify-container {
		padding: 30rpx;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 15rpx;
	}
</style>